<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>查看订单</title>
    <script src="js/jquery.min.js"></script>
    <script src="js/checkOrder.js"></script>
    <script src="js/HttpUtil.js"></script>
    <script src="js/CacheUtil.js"></script>
    <!--bootstrap-->
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <script src="bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="panel panel-default" style="margin: 0 auto;width: 95%;">
    <div class="panel-heading">
        <h3 class="panel-title"><span class="glyphicon glyphicon-equalizer"></span>&nbsp;&nbsp;订单详情</h3>
    </div>
    <div class="panel-body">
        <table cellpadding="0" cellspacing="0" align="center" width="100%" class="table table-striped table-bordered table-hover">

            <tr>
                <td>订单编号:</td>
                <td id="orderId">{orderId}</td>
                <td>订单时间:</td>
                <td id="orderTime">{orderTime}</td>
            </tr>
            <tr>
                <td>收件人:</td>
                <td id="addressName">{addressName}</td>
                <td>联系电话:</td>
                <td id="addressPhone">{addressPhone}</td>
            </tr>
            <tr>
            <td>送货地址:</td>
            <td id="addressDetail">{addressDetail}</td>
            <td>总价:</td>
            <td id="orderCount">{orderCount}</td>
        </tr>
            <tr>
                <td>积分:</td>
                <td id="orderIntegral">{integral}</td>
            </tr>
            <tr>
                <td align="center">商品列表:</td>
                <td colspan="3">
                    <table align="center" cellpadding="0" cellspacing="0" width="100%"  class="table table-striped table-bordered table-hover">
                        <tr align="center"  class="info" id="orderDetailHead">
                            <th>序号</th>
                            <th>商品封面</th>
                            <th>商品名称</th>
                            <th>商品评分</th>
                            <th>商品日期</th>
                            <th>商品单价</th>
                            <th>购买数量</th>
                            <th>小计</th>
                        </tr>
<!--                        商品遍历位置-->
                    </table>
                </td>
            </tr>
            <tr>
                <td align="right" colspan="4" style="margin-right: 40px;">
                    <a href="/shop-app/myOrders.html" class="btn btn-danger btn-sm">返回订单列表</a>
                    &nbsp;&nbsp;

                        &nbsp;&nbsp;
                        <button type="button"  class="btn btn-success btn-sm">支付宝支付</button>

                </td>
            </tr>
        </table>
    </div>
</div>
<script>
    $(function () {
        $(".btn.btn-success.btn-sm").click(function () {
            console.log("已经点击支付");
            let orderPayables = $("#orderCount").html();
            let ordersubject = $("#orderTime").html();
            let orderBody="随便写点东西，总比什么没有好"
            $.ajax({
                type: "POST",
                dataType: "html",
                url: "/shop-api/pay/alipaySum",
                data: {payables: orderPayables, subject: ordersubject,body:orderBody},
                success: function (resp) {
                    console.log("alipay resp is : " + resp);
                     $('body').append(resp);
                     $("form").attr("target", "_blank");
                }
            })

        })
    })


</script>

<template id="template_item">
    <tr align="center">
        <th>{count}</th>
        <th>
            <img src="{picture}" width="50px" height="50px">
        </th>
        <th>{productName}</th>
        <th>{productState}</th>
        <th>{productTime}</th>
        <th>{productPrice}</th>
        <th>{itemNum}</th>
        <th>{itemCount}</th>
    </tr>
</template>
</body>
</html>